<template>
    <div class="dashboard-container">
        <tool :get="queryFn" :selectionVideo="currentSelection" ref="attentionTool"></tool>
        <tableList v-loading="loading" :tableData="tableData" @attention="attentionFn" @select="selectList"></tableList>
        <div class="pagination">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pagination.pageIndex"
                    :page-sizes="[20, 50, 100, 200]"
                    :page-size="pagination.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="pagination.total">
            </el-pagination>
        </div>
    </div>
</template>

<script>
  import tool from './tool'
  import tableList from './tableList'
  import { getList } from '@/api/filtrate'

  export default {
    name: 'filtrate',
    components: {
      tool,
      tableList
    },
    data () {
      return {
        tableData: [],
        listData: [
          '开始关注',
          '账号：1234123434为视频ID为123455关注成功',
          '关注已久暂停'
        ],
        pagination: {
          pageIndex: 1,
          pageSize: 20,
          total: 0
        },
        formFilter: {
          // flowId: '',
          // type: '',
          // phone: '',
          // timeStart: '',
          // timeEnd: '',
          // walletAddress: '',
          // txHash: '',
          // date: []
        },
        loading: false,
        currentSelection: [], //选中视频列表
      }
    },
    methods: {
      handleSizeChange (val) {
        this.pagination.pageSize = val
        this.get()
      },
      handleCurrentChange (val) {
        this.pagination.pageIndex = val
        this.get()
      },
      queryFn () {
        this.pagination.pageIndex = 1
        this.get()
      },
      async get () {
        return new Promise(async (resolve, reject) => {
          try {
            this.loading = true
            // if (this.formFilter.date.length) {
            //   this.formFilter.timeStart = this.formFilter.date[0]
            //   this.formFilter.timeEnd = this.formFilter.date[1]
            // }
            const params = {
              ...this.pagination
            }
            delete params.date
            delete params.total
            const response = await getList(params)
            this.tableData = response.data
            this.pagination.total = response.total
            this.loading = false
            resolve(response)
          } catch (e) {
            this.loading = false
            reject(e)
            console.log(e)
          }
        })
      },
      async attentionFn (val) {
        if (this.$refs['attentionTool']) {
          this.$refs['attentionTool'].startAttention(val.videoUrl)
        }
        // try {
        //   const params = {}
        //   const {data} = await startAttention(params)
        // } catch (e) {
        //   console.log(e)
        // }
      },
      selectList (val) {
        this.currentSelection = val;
      }
    },
    mounted () {
      this.get()
    }
  }
</script>

<style lang="scss" scoped>



</style>
